<script setup>
import { computed } from 'vue'

/** Converts the new lines of a text into <br />
 *
 * "foo \n bar" will be rendered as "foo <br /> bar"
 *
 * Prevents HTML injection.
 */
const props = defineProps({
  'text': {type: String, required: true}
})
const lines = computed(() => props.text.split("\n"))
</script>

<template>
  <template v-for='(line, _, index) in lines'>
    {{ line }}
    <template v-if='index < lines.length'><br /></template>
  </template>
</template>

